~/brickswiki $ grep -r "Query Loop" ./guides/
「Query Loop」
共 6 篇相关教程
tutorial
Bricks 用 IsotopeJS 做筛选（一）：入队库与基础初始化
教程：IsotopeJS 筛选系列第一篇——在 Bricks 里用 WordPress 原生入队 IsotopeJS（Bricks 内置库），配好 CSS 变量响应式列数与初始化脚本。
Ray Chan·2026 / 08 / 18·约 3 分读tutorial
Bricks Query Loop 按日期字段条件输出元素（Pro 思路卡）
选题卡：在 Bricks Query Loop 里，只有当某个日期型自定义字段（如 event_date）大于当前时间时，才显示某个元素（如“即将开始”CTA）。思路+官方钩子，完整代码见 BricksLabs Pro。
Ray Chan·2026 / 08 / 18·约 3 分读tutorial
Bricks Query Loop 布局切换器：网格/列表一键切换（无插件）
教程：在 Bricks 里给用户提供 Query Loop 网格/列表布局切换按钮，纯 CSS 变量 + 原生 JS 实现，不装插件、不重复内容、不伤 SEO。
Ray Chan·2026 / 08 / 18·约 3 分读tutorial
Bricks + WooCommerce 商品循环模板：用一套模板接管默认商品循环
教程：在 Bricks 里建一个标准 WooCommerce 商品循环模板，通过钩子覆盖默认循环，避免每个页面重复设计。外贸独立站商品页批量统一的实战方法。
Ray Chan·2026 / 08 / 18·约 3 分读tutorial
Bricks Query Loop 条件类名与 data 属性：库存大于 25 加 in-stock
教程：在 Bricks Query Loop 中根据自定义字段（如库存）条件添加 CSS 类名和 data 属性，实现视觉区分。
Ray Chan·2026 / 08 / 18·约 3 分读tutorial
WooCommerce 产品循环模板覆盖：用 Bricks 模板替换默认产品循环
教程：用 Bricks 模板覆盖 WooCommerce 默认产品循环 content-product.php，一套设计全站复用。
Ray Chan·2026 / 08 / 18·约 3 分读